<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>作业二</title>
    <style>
        *{
            margin:0px;
            padding:0px;

        }

    .header{
        height:60px;
        text-align:center;
        color:#333;
        line-height:60px;
        background-color:lightcyan;

    }
    .content{
        margin-left: auto;
        margin-right: auto;
        width:400px;
        background-image:url(images/timg2.jpg);
        padding: 10px;
        border: 1px solid silver;
    }
    .serch{
        width: 280px;
        height: 30px;

    }
    .bdbt{
        width:100px;
        height:34px;
        background-color:aquamarine;
        border:1px solid springgreen;
        color:#333;

    }
    .picTitle{
        color:deepskyblue;
        margin-top:20px;
        margin-left:30px;


    }
    .img{
        width:400px;
        margin-top:10px;
        margin-bottom:10px;
    }
    p{

        height:50px;
        margin-left:5px;

    }
    
    </style>
</head>
<body>
    <h3 class="header">
        个人网站
    </h3>
    <div class="content">

        <input type="text" class="serch">
        <button class="bdbt">百度一下</button>
        <h3 class="picTitle">|About Us|</h3>
        <img src="images/timg1.jpg" alt="" class="img">
        <p>关于单纯的信任</p>
        <p>关于拥抱的心疼</p>
        <p>关于青春 那件傻事的余震</p>
        <p>就用这一首歌来作证</p>
        <p>2015年 周笔畅 反思青春 温情解读关于“我们”</p>
        <a href="http://www.baidu.com">百度一下</a>
        <a href="http://www.taobao.com">淘一下</a>

    </div>
</body>
</html>